<div id="content">
	<div class="row s_page_title">
		<sa-big-breadcrumbs [items]="['车辆定位管理','数据下载']" icon="fa fa-car" class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></sa-big-breadcrumbs>
	</div>
	<!--表格头部操作部分-->
	<div class="s_table">
		<h3 class="s_table_title"><span class="verticalLine">&nbsp;</span>数据下载</h3>
		<div class="page-header clearfix s_table_opreation">
			<div class="left page-header-btn railHtml">
				<form  name="loadForm" id="loadForm" class="form-horizontal" (ngSubmit)="onSubmit()" novalidate="novalidate" [saBootstrapValidator]="validatorOptions">
				<div class="top_module" *ngIf='isInterface' style="min-width: auto;">
					<span class="module_text">接口类型</span>
					<select name="apiType" id="apiType" class="module_inp" [(ngModel)]='apiType'>
						<option value="1">默认</option>
						<!-- <option value="2">临时表</option> -->
					</select>
				</div>
				<div class="top_module">
					<span class="module_text">公司名称</span>
					<div class="company_tree" style="display: inline-block;vertical-align: middle;">
						<div class="clearfix" style="position: relative;">
							<div class="s_hover_box s_fix_radius">
								<input class="form-control tree_company_input" id="company" name="selectedCompanyName" (input)="companySearch()" autocomplete="off" [(ngModel)]='selectedCompanyName' (click)="companyClick()" type="text" placeholder="请选择或输入关键字" />
								<div class="s_del_icon" (click)='delText()'>x</div>
							</div>
							<div class="s_tree_box" id="tree_box">
								<div class="vision_tree" id="vision_tree">
									<div id="tree"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="top_module form-group" style="min-width: auto;">
					<span class="module_text">车牌号</span>
					<div class="s_hover_box">
						<input type="hidden"  class="form-control" id="carNumberInput" name="carNumberInput" [(ngModel)]='carNumber'>
						<select class="select2" id="carNumberSelect2" name="carNumberSelect2">
							<option value=''></option>
						</select>
						<div class="s_del_icon" (click)='del_carNumber()'>x</div>
					</div>
				</div>
				
				<div class="selectDate top_module form-group timeMess">
					<div class="input-daterange input-group s_selected_time_box s_hover_box">
						<input type="text" [(ngModel)]='startTime' name='startTime' class="form-control s_selected_time" id="datetimepicker1"  autocomplete="off" placeholder="选择开始时间"/>
						<span class="s_selected_time_spe">至</span>
						<input type="text" [(ngModel)]='endTime' name='endTime' class="form-control s_selected_time" id="datetimepicker2"  autocomplete="off" placeholder="选择结束时间"/>
						<div class="s_del_icon" (click)='del_date()'>x</div>
					</div>
				</div>

				<div class="top_module form-group" style="min-width: auto;">
					<span class="module_text">时间间隔</span>
					<input class="module_inp form-control" type="number"  data-bv-integer-message="请输入正确的数字"
						name="spaceTime" [(ngModel)]="spaceTime" placeholder=" 单位(秒)" />
				</div>

				<!-- <div class="top_module form-group">
					<span class="module_text" style="margin-top: -10px;">重量范围</span>
					<input *ngIf="!isEqualWeight" class="module_inp scope_inp noRadius form-control" [(ngModel)]="minWeight" name="minWeight" placeholder=" 最小重量 吨" />
					<select name="weigthCalcu" id="weigthCalcu" [(ngModel)]="weigthCalcu" class="weigthCalcu" (change)='weigthCalcuChage()'>
						<option value="le">＜=</option>
						<option value="lt">＜</option>
						<option value="eq">&ngsp;=</option>
					</select>
					<input class="module_inp scope_inp form-control" [(ngModel)]="maxWeight" name="maxWeight"  placeholder="最大重量 吨" />
				</div> -->
				
				<!-- <div class="top_module form-group">
					<span class="module_text" style="margin-top: -10px;">车速范围</span> 
					<input *ngIf="!isEqualSpeed" class="module_inp scope_inp noRadius form-control" [(ngModel)]="minSpeed" name="minSpeed"  placeholder="最小车速..." />
					<select name="speedCalcu" id="speedCalcu" name="speedCalcu" [(ngModel)]="speedCalcu" (change)='speedCalcuChage()' class="speedCalcu">
						<option value="le">＜=</option>
						<option value="lt">＜</option>
						<option value="eq">&ngsp;=</option>
					</select>
					<input class="module_inp scope_inp form-control" [(ngModel)]="maxSpeed" name="maxSpeed" placeholder="最大车速 km/h" />
				</div> -->
				<!--<button type="button" class="btn btn-primary" (click)="showScreenBox(positionModal)">选择</button>-->
				<button type="submit" class="btn btn-primary downBtn" (click)="download()">下载</button>
			</form>
			</div>
		</div>
		<!--表格头部操作部分end-->
	</div>
	<div style="padding: 0 1px;margin-top: 12px;height: 75vh;min-height: 650px;" class="row">
		<div class="col-xs-12 col-sm-7 checkItemBox">
			<div class="lodaHtml" style="position: relative;border-bottom: 1px solid #eee;">
				<h3 style="line-height: 32px;padding-left: 12px;font-weight: bold;">数据下载</h3>
				<button type="button" (click)='sortParamsEvent()' title="清空排序顺序 " class="btn btn-xs btn-primary" style="position: absolute;right: 0%;top: 6px;left: inherit;">清空</button>
			</div>
			<div class="row" *ngFor="let item of checkArr;let i=index;" style="margin-top: 12px;border-bottom: 1px solid #eee;" onselectstart="return false">
				<div class="col-xs-12 typeText" style="line-height: 24px;">
					<label class="checkbox-inline">
						<input class="checkbox style-0" type="checkbox"  [(ngModel)]="item.allChecked" (change)="checkedGroupEvent(i)" >
			            <span >{{item.name}}</span>
		          	</label>
				</div>
				<div class="col-xs-3 itemDiv" *ngFor="let _item of item.itemStaus;let _i=index;" >
					<label class="checkbox-inline">
						<input class="checkbox style-0" type="checkbox" [(ngModel)]="_item.checked"  (change)="checkedItemEvent(i,_i)">
			            <span >{{_item.value}}</span>
		          	</label>
				</div>
			</div>
			<div class="row"  style="margin-top: 2px;border-bottom: 1px solid #ccc;">
				<div class="col-xs-12 typeText" style="line-height: 24px;">
					<span>下载顺序:</span>
				</div>
				<div style="padding-left: 12px;">
					<div class="itemDiv inline_block" *ngFor="let _item of sortParamsArr;let i=index;" style="min-width: 60px;">
						<span>{{i+1}}.{{_item.value}}</span>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xs-12 col-sm-5 downloadInfo">
			<div style="background: white;position: relative;height: 100%;">
				<div class="panel panel-default" style="height: 100%;">
					<div class="panel-body status smart-form vote">
						<div class="who clearfix">
							<img alt="img" style="border-left: none;" class="offline" src="assets/img/trackImage/loadFile.png">
							<span class="name" ><b style="line-height: 36px;color: #666666;">文件下载信息</b> </span>
						</div>
						<div class="image">
							<span style="width:20%;">下载进度：</span>
							<div style="width:80%;display: inline-block;position: relative;top: 1px;">
								<div id='barWarp' style="width:100%;display: none;">
									<div *ngIf="!downOver" class="progress progress-small progress-striped active">
										<div id="bar" class="progress-bar barStyle">{{downloadRate}}% </div>
									</div>
									<div *ngIf="downOver" class="progress progress-small progress-striped">
										<div class="progress-bar barStyle" style="width: 100%;">100%</div>
									</div>
								</div>
							</div>
						</div>
						<ul class="comments">
							<li>文件名称：{{fileName}}</li>
							<li>时间区间： {{timeSection}}</li>
							<!-- <li>重量范围：{{weigthCalcuStr}} -->
								<!--<span *ngIf="weigthCalcu=='le'">
									<span *ngIf="minWeight =='' && maxWeight ==''"> </span>
									<span *ngIf="minWeight =='' && maxWeight!==''">小于等于 {{maxWeight}} 吨</span>
									<span *ngIf="minWeight!=='' && maxWeight!==''">{{minWeight}} 小于等于 {{maxWeight}} 吨</span>
									<span *ngIf="minWeight!=='' && maxWeight ==''">大于等于 {{minWeight}} 吨</span>
								</span>
								<span *ngIf="weigthCalcu=='lt'">
									<span *ngIf="minWeight =='' && maxWeight ==''"> </span>
									<span *ngIf="minWeight =='' && maxWeight!==''">小于 {{maxWeight}} 吨</span>
									<span *ngIf="minWeight!=='' && maxWeight!==''">{{minWeight}} 小于 {{maxWeight}} 吨</span>
									<span *ngIf="minWeight!=='' && maxWeight ==''">大于 {{minWeight}} 吨</span>
								</span>
								<span *ngIf="weigthCalcu=='eq'">
									<span *ngIf="maxWeight !==''">{{maxWeight}} 吨</span>
								</span>-->
							<!-- </li> -->
							<!-- <li>车速范围：{{speedCalcuStr}} -->
								<!--<span *ngIf="speedCalcu=='le'">
									<span *ngIf="minSpeed =='' && maxSpeed ==''"> </span>
									<span *ngIf="minSpeed =='' && maxSpeed!==''">小于等于 {{maxSpeed}} km/h</span>
									<span *ngIf="minSpeed!=='' && maxSpeed!==''">{{minSpeed}} 小于等于 {{maxSpeed}} km/h</span>
									<span *ngIf="minSpeed!=='' && maxSpeed ==''">大于等于  {{minSpeed}} km/h</span>
								</span>
								<span *ngIf="speedCalcu=='lt'">
									<span *ngIf="minSpeed =='' && maxSpeed ==''"> </span>
									<span *ngIf="minSpeed =='' && maxSpeed!==''">小于 {{maxSpeed}} km/h</span>
									<span *ngIf="minSpeed!=='' && maxSpeed!==''">{{minSpeed}} 小于 {{maxSpeed}} km/h</span>
									<span *ngIf="minSpeed!=='' && maxSpeed ==''">大于 {{minSpeed}} km/h</span>
								</span>
								<span *ngIf="speedCalcu=='eq'">
									<span *ngIf="maxSpeed !==''">{{maxSpeed}} km/h</span>
								</span>-->
							<!-- </li> -->
							<li>时间间隔：{{spaceTime_}} </li>
							<li>文件大小：{{fileSize}}</li>
							<li>下载时长：{{lTimelong}}</li>
							<li (click)='jumpDownloadSrc(filePosition)' style="overflow: hidden;word-wrap: break-word;">下载地址：<span style="cursor: pointer;color: #1A6DDD;">{{filePosition}}</span></li>
						</ul>
						<div class="links">
							<div class="text-right"  *ngIf="filePosition!==''">
			                	<a class="btn btn-xs btn-primary" (click)='jumpDownloadSrc(filePosition)' title="点击手动跳转下载" >手动下载</a>
			              </div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 在场车辆 弹窗-->
	<section bsModal #positionModal="bs-modal" class="modal y-modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" (click)="hideScreenBox(positionModal)" aria-label="Close"><span aria-hidden="true">&times;</span></button>
					<h4 class="modal-title">下载选项</h4>
				</div>
				<div class="modal-body"></div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" (click)="hideScreenBox(positionModal)">取消</button>
					<button type="button" class="btn btn-primary" (click)="hideScreenBox(positionModal)">确认</button>
				</div>
			</div>
		</div>
	</section>
	<!-- 在场车辆 弹窗-->
</div>